<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>项目看板</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all"/>
    <link rel="stylesheet" href="__CSS__/admin.css" media="all">
    <style type="text/css">

        /* tooltip */
        #tooltip {
            position: absolute;
            border: 1px solid #ccc;
            background: #333;
            padding: 2px;
            display: none;
            color: #fff;
        }

        .grid-demo {
            padding: 10px;
            line-height: 20px;
            text-align: center;
            background-color: #79C48C;
            color: #fff;
        }

        .develop {
            background-color: #1E9FFF;
        }

        .test {
            background-color: #FFB800;
        }

        .develop-test {
            background-color: #FF5722;
        }

        .other {
            background-color: #185da5;
        }

        .leisure {
            background-color: #2ec770;
        }
        .padding-2px{
            padding: 2px !important;
        }
        .th-padding{
            padding-right: 2px !important;
            padding-left: 2px !important;
        }
    </style>
</head>
<body style="padding:10px;">
<div class="tplay-body-div">
    <form class="layui-form serch" action="{:url('admin/working/projectIndex')}" method="get">
        <div class="layui-form-item" style="float: left;">

            <div class="layui-input-inline">
                <div class="layui-inline">
                    <select name="project_type" lay-search="">
                        <option value="">全部</option>
                        {volist name="projetcTypeName" id="po"}
                        <option value="{$key}" {notempty name="$project_type"}{eq name="$project_type" value="$key"} selected=""{/eq}{/notempty}>{$po}</option>
                        {/volist}
                    </select>
                </div>
            </div>
            <div class="layui-input-inline">
                <div class="layui-inline">
                    <select name="project_status" lay-search="">
                        <option value="">全部</option>
                        {foreach $projectStatusName as $p=>$ps}
                        <option value="{$p}" {notempty name="$project_status"}{eq name="$project_status" value="$p"} selected=""{/eq}{/notempty}>{$ps}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="layui-input-inline">
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" id="begin_time" placeholder="开始日期" name="begin_time" value="{$begin_time}">
                    </div>
                </div>
            </div>
            <div class="layui-input-inline">
                <div class="layui-inline">
                    <div class="layui-input-inline">
                        <input type="text" class="layui-input" id="estimate_time" placeholder="结束日期" name="estimate_time" value="{$estimate_time}">
                    </div>
                </div>
            </div>

            <button class="layui-btn layui-btn-sm" lay-submit="" lay-filter="serch">查询</button>
        </div>
    </form>

    <div style="width: 100%;overflow-x: scroll;">
        <table class="layui-table" lay-size="sm">
            <thead>
            <tr>
                <th height="22px">
                    <div style="width: max-content;">项目/日期</div>
                </th>
                {volist name="days" id="da"}
                <th <?php echo in_array($da['week'],[6,0])? "bgcolor='lightgray'" :"" ?> class="padding-2px" ><div style="width: max-content;">{$da.day}</div></th>
                {/volist}

            </tr>
            </thead>
            <tbody>
            {volist name="info" id="in"}
            <tr height="33px" style="max-height: 40px;">
                <td><a href="{:url('admin/task/index',['project_id'=>$in.project_id])}">
                    <div style="width: max-content;" class="table-td-hover" tips-title="{$in.project_text}">
                        {$in.project_name}
                    </div>
                </a></td>
                {volist name="in['date_list']" id="tl"}

                <td class="table-td-hover" tips-title="{$in.project_text}"
                    {eq name="$tl.type" value="1"}
                        {eq name="$tl.t_type" value="1"}bgcolor="#1E9FFF"{/eq}
                        {eq name="$tl.t_type" value="2"}bgcolor="#FFB800"{/eq}
                        {eq name="$tl.t_type" value="3"}bgcolor="#FF5722"{/eq}
                        {eq name="$tl.t_type" value="4"}bgcolor="#185da5"{/eq}
                    {/eq}
                {eq name="$tl.type" value="2"}bgcolor="#2ec770"{/eq} >
                </td>
                {/volist}
            </tr>
            {/volist}
            </tbody>
        </table>
    </div>
    <br/>
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md2">
            <div class="grid-demo develop padding-2px">开发</div>
        </div>
        <div class="layui-col-md2">
            <div class="grid-demo test padding-2px">测试</div>
        </div>
        <div class="layui-col-md2">
            <div class="grid-demo develop-test padding-2px">开发&测试</div>
        </div>
        <div class="layui-col-md2">
            <div class="grid-demo other padding-2px">其他</div>
        </div>
        <div class="layui-col-md2">
            <div class="grid-demo leisure padding-2px">空白期</div>
        </div>
    </div>
    <br/>
    {include file="public/foot"}

    <script>
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#begin_time'
            });
        });
    </script>
    <script>
        layui.use('laydate', function () {
            var laydate = layui.laydate;
            laydate.render({
                elem: '#estimate_time'
            });
        });

        //tips
    </script>
    <script>
        //tips
        window.onload = function () {
            const hoverEles = $('.table-td-hover')
            let subTips;
            hoverEles.each(function (index, ele) {
                $(ele).hover(function () {
                    showHover(ele)
                }, function () {

                })
            });

            function showHover(ele) {
                subTips = layer.tips($(ele).attr('tips-title'), ele)
            }
        };

        layui.use(['laypage', 'layer'], function () {
            var laypage = layui.laypage
                , layer = layui.layer;

            //自定义首页、尾页、上一页、下一页文本
            laypage.render({
                elem: 'demo3'
                , count: 100
                , first: '首页'
                , last: '尾页'
                , prev: '<em>←</em>'
                , next: '<em>→</em>'
            });
        });
    </script>
</div>
</body>
</html>
